<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>注册页面</title>
    <meta
            content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"
            name="viewport">

    <link rel="stylesheet"
          th:href="@{/static/plugins/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/font-awesome/css/font-awesome.min.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/ionicons/css/ionicons.min.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/iCheck/square/blue.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/morris/morris.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/jvectormap/jquery-jvectormap-1.2.2.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/datepicker/datepicker3.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/daterangepicker/daterangepicker.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/datatables/dataTables.bootstrap.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/treeTable/jquery.treetable.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/treeTable/jquery.treetable.theme.default.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/select2/select2.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/colorpicker/bootstrap-colorpicker.min.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/bootstrap-markdown/css/bootstrap-markdown.min.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/adminLTE/css/AdminLTE.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/adminLTE/css/skins/_all-skins.min.css}">
    <link rel="stylesheet"
          th:href="@{/css/style.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/ionslider/ion.rangeSlider.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/ionslider/ion.rangeSlider.skinNice.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/bootstrap-slider/slider.css}">
    <link rel="stylesheet"
          th:href="@{/static/plugins/bootstrap-datetimepicker/bootstrap-datetimepicker.css}">
    <script
            th:src="@{/static/plugins/jQuery/jquery-2.2.3.min.js}"></script>
    <script
            th:src="@{/static/plugins/jQueryUI/jquery-ui.min.js}"></script>
    <script>
        $.widget.bridge('uibutton', $.ui.button);
    </script>
    <script
            th:src="@{/static/plugins/bootstrap/js/bootstrap.min.js}"></script>
    <script
            th:src="@{/static/plugins/raphael/raphael-min.js}"></script>
    <script
            th:src="@{/static/plugins/morris/morris.min.js}"></script>
    <script
            th:src="@{/static/plugins/sparkline/jquery.sparkline.min.js}"></script>
    <script
            th:src="@{/static/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js}"></script>
    <script
            th:src="@{/static/plugins/jvectormap/jquery-jvectormap-world-mill-en.js}"></script>
    <script
            th:src="@{/static/plugins/knob/jquery.knob.js}"></script>
    <script
            th:src="@{/static/plugins/daterangepicker/moment.min.js}"></script>
    <script
            th:src="@{/static/plugins/daterangepicker/daterangepicker.js}"></script>
    <script
            th:src="@{/static/plugins/daterangepicker/daterangepicker.zh-CN.js}"></script>
    <script
            th:src="@{/static/plugins/datepicker/bootstrap-datepicker.js}"></script>
    <script
            th:src="@{/static/plugins/datepicker/locales/bootstrap-datepicker.zh-CN.js}"></script>
    <script
            th:src="@{/static/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js}"></script>
    <script
            th:src="@{/static/plugins/slimScroll/jquery.slimscroll.min.js}"></script>
    <script
            th:src="@{/static/plugins/fastclick/fastclick.js}"></script>
    <script
            th:src="@{/static/plugins/iCheck/icheck.min.js}"></script>
    <script
            th:src="@{/static/plugins/adminLTE/js/app.min.js}"></script>
    <script
            th:src="@{/static/plugins/treeTable/jquery.treetable.js}"></script>
    <script
            th:src="@{/static/plugins/select2/select2.full.min.js}"></script>
    <script
            th:src="@{/static/plugins/colorpicker/bootstrap-colorpicker.min.js}"></script>
    <script
            th:src="@{/static/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.zh-CN.js}"></script>
    <script
            th:src="@{/static/plugins/bootstrap-markdown/js/bootstrap-markdown.js}"></script>
    <script
            th:src="@{/static/plugins/bootstrap-markdown/locale/bootstrap-markdown.zh.js}"></script>
    <script
            th:src="@{/static/plugins/bootstrap-markdown/js/markdown.js}"></script>
    <script
            th:src="@{/static/plugins/bootstrap-markdown/js/to-markdown.js}"></script>
    <script
            th:src="@{/static/plugins/ckeditor/ckeditor.js}"></script>
    <script
            th:src="@{/static/plugins/input-mask/jquery.inputmask.js}"></script>
    <script
            th:src="@{/static/plugins/input-mask/jquery.inputmask.date.extensions.js}"></script>
    <script
            th:src="@{/static/plugins/input-mask/jquery.inputmask.extensions.js}"></script>
    <script
            th:src="@{/static/plugins/datatables/jquery.dataTables.min.js}"></script>
    <script
            th:src="@{/static/plugins/datatables/dataTables.bootstrap.min.js}"></script>
    <script
            th:src="@{/static/plugins/chartjs/Chart.min.js}"></script>
    <script
            th:src="@{/static/plugins/flot/jquery.flot.min.js}"></script>
    <script
            th:src="@{/static/plugins/flot/jquery.flot.resize.min.js}"></script>
    <script
            th:src="@{/static/plugins/flot/jquery.flot.pie.min.js}"></script>
    <script
            th:src="@{/static/plugins/flot/jquery.flot.categories.min.js}"></script>
    <script
            th:src="@{/static/plugins/ionslider/ion.rangeSlider.min.js}"></script>
    <script
            th:src="@{/static/plugins/bootstrap-slider/bootstrap-slider.js}"></script>
    <script
            th:src="@{/static/plugins/bootstrap-datetimepicker/bootstrap-datetimepicker.min.js}"></script>


    <script>
        // 设置激活菜单
        function setSidebarActive(tagUri) {
            var liObj = $("#" + tagUri);
            if (liObj.length > 0) {
                liObj.parent().parent().addClass("active");
                liObj.addClass("active");
            }
        }
        $(function () {
            $('input').iCheck({
                checkboxClass: 'icheckbox_square-blue',
                radioClass: 'iradio_square-blue',
                increaseArea: '20%' // optional
            });

            $('#datepicker-a3').datetimepicker({
                format: "yyyy-mm-dd hh:ii",
                autoclose: true,
                todayBtn: true,
                language: "zh-CN"
            });
            // 激活导航位置
            setSidebarActive("order-manage");
            $("#datepicker-a3").datetimepicker({
                format: "yyyy-mm-dd hh:ii",
            });
            $("#form1").submit(function () {
               if($("#mima1").val().trim()!=$("#mima2").val()){
                   alert("两次密码必须一致");
                   return false;
               }
            });
            var error=$("#error").val();
            if(error=="1"){
                alert("注册失败");
            }
            
            $("#username").blur(function () {
                //判断用户名是否存在
                //1.获得用户名
                var username=$(this).val();
                //向服务发送请求,查看用户名是否存在
                $.ajax({
                    type:"post",
                    url:"http://localhost:9000/SpringbootDemo/user/isUsernameExist",//请求该控制
                    data:"username="+username,
                    success:function (rtn) {
                        // 控制器给与响应
                        if (rtn==true){
                            alert("用户名已存在");
                            // 注册按钮不用
                            $("#register").attr("disabled",true);
                        }else{
                            // 注册按钮可用
                            $("#register").attr("disabled",false);
                        }
                    },
                    error:function () {
                        //不成功的情况
                        // window.location="";
                    }

                })

            });//失去焦点
        });
    </script>
</head>

<body class="hold-transition login-page">
<div class="login-box">
    <div class="login-logo">
        <a href="all-admin-index.html"><b></b>后台管理系统</a>
    </div>
    <!-- /.login-logo -->
    <div class="login-box-body">
        <p class="login-box-msg">注册页面</p>

        <form id="form1" th:action="@{/user/register}" method="post">
            <input id="error" type="hidden"  th:value="${error}"/>
            用户名：
            <div class="form-group has-feedback">
                <input type="text" name="username" class="form-control"
                       placeholder="用户名"  id="username" required> <span
                    class="glyphicon glyphicon-envelope form-control-feedback"></span>
            </div>
            密&nbsp;&nbsp;&nbsp;码：
            <div class="form-group has-feedback">
                <input type="password" name="password" class="form-control"
                       placeholder="密码"  id="mima1" required > <span
                    class="glyphicon glyphicon-lock form-control-feedback"></span>
            </div>
            重复密码：
            <div class="form-group has-feedback">
                <input type="password" name="repassword" class="form-control"
                       placeholder="重复密码" id="mima2" required> <span
                    class="glyphicon glyphicon-lock form-control-feedback"></span>
            </div>
            注册时间:
            <div class="input-group date">
                <div class="input-group-addon">
                    <i class="fa fa-calendar"></i>
                </div>
                <input type="text" class="form-control pull-right"
                       id="datepicker-a3" name="registerTime">
            </div>

            <div class="row">
                <div class="col-xs-8">
                    <div class="checkbox icheck">
                    </div>
                </div>
                <!-- /.col -->
                <div class="col-xs-4">
                    <button type="submit" class="btn btn-primary btn-block btn-flat" id="register">注册</button>
                </div>
                <!-- /.col -->
            </div>
        </form>
    </div>
    <!-- /.login-box-body -->
</div>
</body>

</html>